<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片插入</title>
</head>
<body>
<!--src用来保存图片的路径 alt用来保存图片加载失败的替换文字信息-->
<!--从当前html文件出发去找图片资源,要注意写完整的图片名!name.suffix
1)图片与html在同一级目录,直接写图片全名2.png
2)图片在html文件的下一级目录,先写文件夹名,再写文件夹下的图片全名 img/3.png
3)图片在html文件的上一级目录,先../回到上一级目录,再写图片全名 ../1.jpg
-->
<img src="../1.jpg" alt="诶呀,图片被外星人偷走了">
<img src="2.jpg" alt="诶呀,图片被外星人偷走了">
<img src="img/3.jpg" alt="诶呀,图片被外星人偷走了">
<!--绝对路径:从盘符或协议开始-->
<img src="https://tse3-mm.cn.bing.net/th/id/OIP-C.bP2OKUSfWHWjVMScoklf6wAAAA?w=84&h=180&c=7&r=0&o=5&pid=1.7">
<hr>
<!--width设置图片宽度 height设置图片高度
    图片失真:
    图片本身是有大小宽高比的,可以设置宽高其中的一个属性,另一个会根据图片宽高比而改变-->
<img src="img/fcq.jpg" width="300px" title="这是一张帅哥的图片">
</body>
</html>